<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>MENU</title>
		<!-- 引入reset.css用来清除浏览器的默认样式 -->
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<!-- 引入page-index -->
		<link rel="stylesheet" type="text/css" href="css/page-index.css"/>
	</head>
	<body>
		<div class="all">
			<div class="top-nav">
				<div class="top-nav-left">
					<img src="img/Logo.png" alt="网站logo" />
				    <a href="#">Gratia</a>
				</div>
				<div class="top-nav-right">
					<div class="top-nav-right-a"><a href="#">menu1</a></div>
					<div class="top-nav-right-a"><a2 href="#">menu2</a></div>
					<div class="top-nav-right-a"><a href="#">menu3</a></div>
					<div class="top-nav-right-a"><a href="#">menu4</a></div>
				</div>
			</div>
			<div>
				<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="100%" color="whitesmoke" SIZE=2>
			</div>
			<div class="title">
				<a href="#">MENU</a>
				<div class="title-text">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
			</div>
			<div class="main-part">
				<div class="main-part-child">
					<div class="main-part-photo">
						<img src="img/Main Dishes.png">
						<div class="main-part-desc">
							<div class="main-part-title">MAIN DISHES</div>
							<div class="main-part-desc-p">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
						</div>
					</div>
					<div class="main-part-photo">
						<img src="img/Soups.png">
						<div class="main-part-desc">
							<div class="main-part-title">SOUPS</div>
							<div class="main-part-desc-p">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
						</div>
					</div>
					<div class="main-part-photo">
						<img src="img/Hamburgers.png">
						<div class="main-part-desc">
							<div class="main-part-title">HAMBURGERS</div>
							<div class="main-part-desc-p">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
						</div>
					</div>
				</div>
				<div class="main-part-child">
					<div class="main-part-photo">
						<img src="img/Desserts.png">
						<div class="main-part-desc">
							<div class="main-part-title">DESSERTS</div>
							<div class="main-part-desc-p">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
						</div>
					</div>
					<div class="main-part-photo">
						<img src="img/Barbecue.png">
						<div class="main-part-desc">
							<div class="main-part-title">BARBECUE</div>
							<div class="main-part-desc-p">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
						</div>
					</div>
					<div class="main-part-photo">
						<img src="img/Salads.png">
						<div class="main-part-desc">
							<div class="main-part-title">SALADS</div>
							<div class="main-part-desc-p">Lorem ipsum dolor sit amet,consectetur adipscing elit</div>
						</div>
					</div>
				</div>
			</div>
			<div class="footer">
				<div class="tail-line">
					<hr style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="48%" color="whitesmoke" poisition="80% 80%"SIZE=2>
					<img src="img/Logo.png" alt="Logo">
					<hr style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="48%" color="whitesmoke" SIZE=2>
					
					
				</div>
				<div class="footer-text">
					<div class="footer-text1">Gratia Restaurant</div>
					<div class="footer-text2">Copyright 2016. All rights reserved by symu.</div>
					<hr style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="15%" color="whitesmoke" SIZE=3>
				</div>
				<div ></div>
				<div class="footer-imgs">
					<img src="img/FB.png" >
					<img src="img/TR.png" >
					<img src="img/IG.png" >
				</div>
			</div>
		</div>
	</body>
</html>
